<!-- 个人信息 -->
<template>
  <v-container>
    <v-form ref="profileForm">
      <v-text-field
        :value="formData.username"
        label="用户名称"
        disabled
        hint='用户名称无法修改'
        persistent-hint>
        </v-text-field>
      <v-text-field
        v-model="formData.password"
        label="输入密码"
        :type="show1 ? 'text' : 'password'"
        @click:append="show1 = !show1"
        :append-icon="show1 ? 'visibility_off' : 'visibility'"
        v-validate="{ min: 6 }"
        name="password"
        :error-messages="errors.collect('password')"
        data-vv-as="密码"></v-text-field>
      <v-text-field
        v-model="formData.repassword"
        label="密码确认"
        :type="show2 ? 'text' : 'password'"
        @click:append="show2 = !show2"
        :append-icon="show2 ? 'visibility_off' : 'visibility'"
        name="repassword"
        v-validate="{ required: repasswordRequired  , is: formData.password }"
        :error-messages="errors.collect('repassword')"
        data-vv-as="密码确认"></v-text-field>
        <v-text-field v-model="formData.truename" label="真实姓名"></v-text-field>
      <v-text-field
        v-model="formData.email"
        label="Email"
        v-validate="'email'"
        :error-messages="errors.collect('email')"
        data-vv-as="Email"
        name="email"
        required></v-text-field>
      <v-text-field v-model="formData.mobile" label="联系方式"></v-text-field>
      <v-select
        v-model="formData.role"
        :items="rolesArray"
        label="用户角色"
        chips
        ></v-select>
      <v-select
        v-model="formData.status"
        :items="statusArray"
        label="状态"
        chips
      ></v-select>
      <v-btn color="primary" @click="submit">更新</v-btn>
    </v-form>
  </v-container>
</template>
<script>
import { adminInfoUpdate } from '@/api/admin/auth.js'
export default {
  name: 'Profile',
  components: {},
  data: function () {
    return {
      show1: false, // 密码显示1
      show2: false, // 密码显示2
      formData: {
        avatar: 'https://cdn.vuetifyjs.com/images/parallax/material.jpg'
      },
      rolesArray: [
        { text: '超级管理员', value: 'super', disabled: true },
        { text: '普通管理员', value: 'admin' }
      ],
      statusArray: [
        { text: '正常', value: 'normal' },
        { text: '停用', value: 'stop' }
      ]
    }
  },
  created: function () {
    this.$store.dispatch('getUserinfo').then(res => {
      this.formData = res
    })
  },
  computed: {
    repasswordRequired: function() {
      return (this.formData.password !== undefined) && (this.formData.password !== '')
    }
  },
  methods: {
    submit: function() {
      this.$validator.validate().then(result => {
        if (result) {
          // todo
          adminInfoUpdate(this.formData).then(res => {
            this.$toasted.success(res.data)
          })
        }
      })
    }
  }
}
</script>
<style scoped>
</style>
